<template>
	<view class="system-coin">
		<view class="order-danhao">
			<view class="order-num">订单号：{{itemdetail.trade_parent_id}}</view>
			<view class="order-time">{{itemdetail.tk_create_time}}</view>
		</view>
		<view class="s-top">
			<image :src="itemdetail.item_img" class="order-shop-icon"></image>
			<view class="order-shop-text">
				<view class="coin-source">{{itemdetail.item_title}}</view>
				<view class="order-type">
					<view class="xishou-btn">{{itemdetail.order_type}}</view>
					<view class="order-count">单价:￥{{itemdetail.item_price}}  x  {{itemdetail.item_num}}</view>
				</view>
				
			</view>
		</view>
		<view class="nocoin-block">
			<view class="nocoin-text">
				可得佣金：
				<text class="xiaji">
				{{itemdetail.pub_share_fee=="0.00"?itemdetail.pub_share_pre_fee:itemdetail.pub_share_fee}}
				</text>
			</view>
			<view class="coin-status">{{getIispay(itemdetail.is_pay)}}</view>
		</view>
		<view class="order-cost">
			<view class="cost-num">支付金额：¥  {{itemdetail.alipay_total_price}}</view>
		</view>
	</view>
</template>

<script>
	export default{
		name:"orderFriend",
		data(){
			return{
				
			}
		},
		props:{
			itemdetail:{
				type:Object
			}
		},
		methods:{
			getIispay(is_pay){
				if(is_pay == 0){
					return "完成后发放"
				}
				if(is_pay == 1){
					return '已发放'
				}
				if(is_pay == 13){
					return '已失效'
				}
			}
		}
	}
</script>

<style>
	.system-coin{
		width:660upx;
		height:auto;
		background:rgba(255,255,255,1);
		box-shadow:0px 9upx 27upx rgba(0,0,0,0.16);
		opacity:1;
		border-radius:18upx;
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		margin: 10upx 0;
		padding-bottom: 10upx;
	}
	.order-danhao{
		width: calc(100% - 72upx);
		height: 60upx;
		border-bottom: 1px solid #F0F3F7;
		display: flex;
		flex-direction: row;
		justify-content: space-between;
		align-items: center;
		padding: 0 36upx 0 36upx;
	}
	.order-num{
		font-size:12px;
		font-family:Alibaba PuHuiTi;
		font-weight:400;
		line-height:25upx;
		color:rgba(17,23,57,1);
		opacity:1;
	}
	.order-time{
		font-size:12px;
		font-family:Alibaba PuHuiTi;
		font-weight:400;
		line-height:25upx;
		color:rgba(177,184,193,1);
		opacity:1;
	}
	.xiaji{
		color: #F47F2A;
	}
	.s-top{
		width: 100%;
		min-height: 152upx;
		height: auto;
		border-bottom: 1px solid #F0F3F7;
		display: flex;
		flex-direction: row;
		justify-content: flex-start;
		align-items: center;
	}
	.order-shop-icon{
		width: 96upx;
		height: 96upx;
		margin: 0 20upx 0 36upx;
	}
	.order-shop-text{
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: flex-start;
	}
	.coin-source{
		height:25upx;
		font-size:13px;
		font-family:Alibaba PuHuiTi;
		font-weight:400;
		line-height:25upx;
		color:rgba(17,23,57,1);
		opacity:1;
		margin-bottom: 33upx;
	}
	.order-type{
		display: flex;
		flex-direction: row;
		justify-content: flex-start;
		align-items: center;
	}
	.xishou-btn{
		font-size: 12px;
		padding: 2upx 10upx;
		color: #F49F2A;
		border-radius: 10upx;
		border: 1px solid #F49F2A;
	}
	.nocoin-block{
		width: calc(100% - 72upx);
		height: 60upx;
		display: flex;
		flex-direction: row;
		justify-content: space-between;
		align-items: center;
		padding: 0 36upx 0 36upx;
		border-bottom: 1px solid #F0F3F7;
	}
	.nocoin-text{
		font-size:12px;
		font-family:Alibaba PuHuiTi;
		font-weight:400;
		line-height:25upx;
		color:rgba(17,23,57,1);
		opacity:1;
	}
	.nocon-delete{
		padding: 4px 20upx;
		background: #F4637A;
		border-radius: 50upx;
		font-size: 12px;
		color: #FFFFFF;
	}
	.order-cost{
		width: calc(100% - 72upx);
		height: 60upx;
		padding: 0 36upx 0 36upx;
		display: flex;
		flex-direction: row;
		justify-content: space-between;
		align-items: center;
	}
	.cost-num{
		font-size:14px;
		font-family:Alibaba PuHuiTi;
		font-weight:500;
		line-height:31upx;
		color:rgba(244,159,42,1);
		opacity:1;
	}
	.coin-status{
		font-size:12px;
		font-family:Alibaba PuHuiTi;
		font-weight:400;
		line-height:25upx;
		color:rgba(244,99,122,1);
		opacity:1;
	}
	.order-count{
		font-size: 12px;
		color: #333333;
		margin-left: 20upx;
	}
</style>
